<template>
	<view>
		<view class="header">
			余额 {{walletdetail.money}}
		</view>
		<view class="walletcard">
			<view class="commen">
				<view class="total">
					可提现金额(元)
				</view>
				<view class="price">
					{{walletdetail.money}}
				</view>
				<view class="box mt-4 d-ai-c d-jc-sb">
					<view class="money">
						<view class="">
							未入账余额(元)
						</view>
						<view class="">
							{{walletdetail.noAccount}}
						</view>
					</view>
					<view class="box d-ai-c d-jc-c owner" @tap="opencash(walletdetail.money)">
						<view class="">
							提现
						</view>
						<image src="https://xb-street.oss-cn-shanghai.aliyuncs.com/xb-doctor-manage/static/images/tiaozhuan.png" mode=""></image>
					</view>
				</view>
			</view>
		</view>
		<view class="detail">
			明细
		</view>
		<view class="record" v-if="walletrecord.length==0">
			<image src="../../static/wujilu@2x.png" mode=""></image>
			<view class="">
				暂无明细
			</view>
		</view>
		<view v-if="walletrecord[0]!=null" class="detaillist box d-ai-c d-jc-sb" v-for="(item,index) in walletrecord" :key="index">
			<view class="detaillist_left">
				{{item.createTime}}
			</view>
			<view class="detaillist_right box d-ai-c d-jc-sb">
				<view class="">
					{{item.money}}
				</view>
				<view class="" style="color: #FA3232;" v-if="item.status==2">
					异常
				</view>
				<view class="" style="color:#55C47D" v-if="item.status==0">
					成功
				</view>
				<view class="" style="color:#FFD166 " v-if="item.status==1">
					进行中
				</view>
			</view>
		</view>
		<orange-fullloading textcolor="#4CA6FF" textsize="30" :loadshow="loadshow" text="加载中"></orange-fullloading>
	</view>
</template>


<script>
	export default {
		data() {
			return {
				walletdetail:'',
				walletrecord:'',
				loadshow:true
			}
		},
		onShow() {
			this.remainingbalance()
			this.fivedetails()
		},
		methods: {
			opencash(withdrawal){
				uni.navigateTo({
					url:'withdrawdeposit?money='+withdrawal
				})
			},
			remainingbalance(){
				this.$api.remainingbalance().then((res) => {
					this.loadshow = false
					if(res.data.success){
						this.walletdetail = res.data.dataMap
					}else{
						uni.showToast({
							title:res.data.message,
							duration:1000,
							icon:'none'
						})
					}
							
				})
			},
			fivedetails(){
				this.$api.fivedetails().then((res) => {
					if(res.data.success){
						this.walletrecord = res.data.dataMap.list
					}else{
						uni.showToast({
							title:res.data.message,
							duration:1000,
							icon:'none'
						})
					}
							
				})
			},
		}
	}
</script>

<style lang="less" scoped>
	.record{
		text-align: center;
		image{
		width: 420rpx;
		height: 272rpx;
		}
		view{
			font-size: 26rpx;
			font-weight: 500;
			color: #666666;
		}
		
	}
.header{
	font-size: 40rpx;
	font-weight: bold;
	color: #333333;
	padding-top: 40rpx;
	padding-left: 30rpx;
}
.walletcard{
	width: 721rpx;
	height: 360rpx;
	background: url(https://xb-street.oss-cn-shanghai.aliyuncs.com/xb-doctor-manage/static/images/kapian@2x.png) no-repeat;
	background-size: cover;
	margin: 0 auto;
	overflow: hidden;
	.commen{
		width: 630rpx;
		height: 240rpx;
		padding: 30rpx;
		// border:1px solid red;
		margin: 0 auto;
		margin-top: 30rpx;
		.total{
		font-size: 28rpx;
		font-weight: 500;
		color: #512B0A;
	  }
	  .price{
		  font-size: 52rpx;
		  font-weight: bold;
		  color: #512B0A;
	  }
	  .money{
		  view:nth-child(1){
			  font-size: 28rpx;
			  font-weight: 500;
			  color: #512B0A;
		  }
		  view:nth-child(2){
			font-size: 30rpx;
			font-weight: bold;
			color: #512B0A;
		  }
	  }
	  .owner{
		  width: 128rpx;
		  height: 60rpx;
		  background: #FFFFFF;
		  border-radius: 30rpx;
		  view{
			  font-size: 26rpx;
			  font-weight: 500;
			  color: #512B0A;
		  }
		  image{
			  width: 27rpx;
			  height: 24rpx;
		  }
	  }
	}
	
}
.detail{
	padding: 30rpx;
	font-size: 32rpx;
	font-weight: bold;
	color: #333333;
	margin-left: 30rpx;
}
.detaillist{
	width: 640rpx;
	height: 80rpx;
	margin: 0 auto;
	.detaillist_left{
		font-size: 28rpx;
		font-weight: 500;
		color: #999999;
	}
	.detaillist_right{
		width: 200rpx;
		view:nth-child(1){
			font-size: 28rpx;
			font-weight: 500;
			color: #333333;
		}
		view:nth-child(2){
			font-size: 28rpx;
			font-weight: 500;
		}
	}
}
</style>
